<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2025/5/12
  Time: 22:47
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<html>
<head>
    <title>注册</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link type="text/css" rel="stylesheet" href="css/base.css">
    <link type="text/css" rel="stylesheet" href="css/index.css">
    <script type="text/javascript" src="js/user.js" defer></script>

</head>
<body>
<%--显示错误消息--%>
<c:if test="${not empty msg}">
    <script>
        alert("${msg}");
    </script>
</c:if>

<%--用户注册模块--%>
<div class="register">
    <h1 class="register-title">注册</h1>
    <form class="register-form" action="${pageContext.request.contextPath}/user_register" method="post" enctype="multipart/form-data">
        <%--        头像上传功能实现--%>

        <div class="avatar-upload">
            <%--            头像预览框--%>
            <div class="avatar-preview" id="avatar-preview">
                <img src="picture/avatar.png" id="avatar-img" alt="头像">
            </div>
            <label for="avatar-input" class="upload-label">上传头像</label>
            <input type="file" id="avatar-input" accept="image/*" name="avatar">
        </div>

        <label for="nickname">昵称</label>
        <input type="text" id="nickname" name="nickname" placeholder="请输入昵称" required>
        <div class="error" id="nicknameError"></div>

        <label for="username">用户名</label>
        <input type="text" id="username" name="username" placeholder="请输入用户名" required>
        <div class="error" id="usernameError"></div>

        <label for="tel">手机号</label>
        <input type="tel" id="tel" name="phone_number" placeholder="请输入手机号" required>
        <div class="error" id="telError"></div>

        <label for="password">密码</label>
        <input type="password" id="password" name="password" placeholder="请输入密码" required>
        <div class="error" id="passwordError"></div>

        <label for="confirm-password">确认密码</label>
        <input type="password" id="confirm-password" name="confirmPassword" placeholder="请再次输入密码" required>
        <div class="error" id="confirmPasswordError"></div>

        <button type="submit" class="register-btn">注 册</button>
    </form>
    <div class="register-footer fr">
        已经有账号？ <a href="${pageContext.request.contextPath}/user_login.jsp">登录></a>
    </div>
</div>


</body>
</html>
